@use "~/styles/variables.scss" as *;

.edit-blance-dialog {
    width: 750rpx;
    height: 85vh;
    padding: 25rpx;
    box-sizing: border-box;
    padding-bottom: calc(constant(safe-area-inset-bottom) + 145rpx);
    padding-bottom: calc(env(safe-area-inset-bottom) + 145rpx);

    .dialog-title {
        font-weight: 500;
        line-height: 60rpx;
        padding: 0 15rpx;
    }

    .dialog-content {
        overflow-y: auto;
        .list-item-container {
            border-radius: 10rpx;
            margin-top: 25rpx;
            padding: 15rpx 25rpx;
            line-height: 60rpx;

            .list-title {
                opacity: 0.8;
            }

            .form-item-container {
                .form-item-label {
                    padding: 16rpx 0;
                    text-align: right;
                }

                .first-item {
                    padding-top: 0;
                }

                .form-input {
                    padding-left: 15rpx;
                    height: 60rpx;
                    line-height: 56rpx;
                    width: 100%;
                    box-sizing: border-box;
                    border: 1px solid;
                    margin: 10rpx;
                    border-radius: 6rpx;
                    display: block;
                    &.disabled {
                        border: none
                    }
                }
            }
        }
    }

    .page-bottom {
        position: fixed;
        bottom: 0;
        left: 0;
        height: 122rpx;
        width: 750rpx;
        z-index: 99;
        padding-bottom: constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
        padding-bottom: env(safe-area-inset-bottom); /* 兼容 iOS >= 11.2 */
        .half-line {
            border-bottom: 1rpx solid;
            width: 200%;
            transform: scale(0.5);
            opacity: 0.2;
        }
        .comment-input-container {
            width: 100%;
            height: 120rpx;
            padding: 25rpx;
            box-sizing: border-box;
            .comment-input {
                height: 60rpx;
                border-radius: 40rpx;
                padding: 10rpx 25rpx;
                background-color: rgba(0,0,0,0.05);
            }
            .btn {
                height: 80rpx;
                box-sizing: border-box;
                border-radius: 40rpx;
                color: #fff;
                text-align: center;
            }
            .preview-btn {
                background-color: rgba(0,0,0,0.4);
                width: 160rpx;
            }
            .save-btn {
                background-color: red;
                width: 460rpx;
            }
        }
    }
}